import React, { Component } from "react";
import { Form, Icon, Input } from "antd";

@Form.create({ name: "addForm" })
class AddForm extends Component {
  handleSubmit() {
    this.props.form.validateFields((err, values) => {
      if (!err) {
        console.log("Received values of form: ", values);
      }
    });
  }
  render() {
    const { getFieldDecorator } = this.props.form;
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 4 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 20 },
      },
    };
    return (
      <Form {...formItemLayout} className="login-form">
        <Form.Item label="标题">
          {getFieldDecorator("title", {
            rules: [{ required: true, message: "Please input your username!" }],
          })(
            <Input
              prefix={<Icon type="user" style={{ color: "rgba(0,0,0,.25)" }} />}
              placeholder="Username"
            />
          )}
        </Form.Item>
      </Form>
    );
  }
}

export default AddForm;
